/* m-reset.css v1.0.3 | MIT License | https://gitee.com/bugeiguojiatuohoutui/m-reset.css */

/* 引用 minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select{margin:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}img,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

/* 上面的开源项目全部用 border-box，这个看习惯是否更改，因为有的设计稿给的时候就单独标注了 padding width，默认样式更方便 */
html {box-sizing: content-box;}

/* 上面的开源项目没写 ol，个人用的挺多的 */
ol {list-style: none}

/* 需要时拷贝到点击元素上，这个属性不能继承，这里只是备注 */
html {-webkit-tap-highlight-color: rgba(0,0,0,0);}

a {text-decoration: none;}

/* 处理刘海屏，看需求是否使用
body {
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
}
*/
/*
constant：小于IOS11.2版本生效
env：大于IOS11.2版本生效
还需要配合 <meta name="viewport" content="viewport-fit=cover>
*/

/* iOS 下修改字号导致页面文本溢出问题 和 通用字体字号 */
body {-webkit-text-size-adjust:100% !important; -webkit-font-smoothing: antialiased; font-size:14px; line-height: 1.5;}

/* 去除 iOS 默认 input 样式 */
input[type="submit"], input[type="reset"], input[type="button"], input:focus, button:focus, select:focus, textarea:focus {outline: none;}
input {-webkit-appearance: none; resize: none; border-radius: 0;}

/* 1px 边框问题，关键属性已完成，只需添加边框颜色、圆角弧度属性即可 */
/* 推荐 mixins 方式传参 */
.border-top-1px,
.border-right-1px,
.border-bottom-1px,
.border-left-1px,
.border-all {
  position: relative;
}

.border-top-1px::before,
.border-right-1px::before,
.border-bottom-1px::after,
.border-left-1px::after,
.border-all::before {
  content: '';
  display: block;
  position: absolute;
  transform-origin: 0 0;
}

.border-top-1px::before {
  border-top: 1px solid #acacac;
  left: 0;
  top: 0;
  width: 100%;
  transform-origin: 0 top;
}

.border-right-1px::before {
  border-right: 1px solid #acacac;
  top: 0;
  right: 0;
  height: 100%;
  transform-origin: right 0;
}

.border-bottom-1px::after {
  border-bottom: 1px solid #acacac;
  left: 0;
  bottom: 0;
  width: 100%;
  transform-origin: 0 bottom;
}

.border-left-1px::after {
  border-left: 1px solid #000;
  top: 0;
  left: 0;
  height: 100%;
  transform-origin: left 0;
}

.border-all::before {
  border: 1px solid #000;
  border-radius: 20px;
}

@media (min-resolution: 2dppx) {

  .border-top-1px::before,
  .border-right-1px::before,
  .border-bottom-1px::after,
  .border-left-1px::after,
  .border-all::before {
    transform: scale(.5) translateZ(0);
  }

  .border-top-1px::before,
  .border-bottom-1px::after,
  .border-all::before {
    width: 200%;
  }

  .border-right-1px::before,
  .border-left-1px::after,
  .border-all::before {
    height: 200%;
  }
}


@media (min-resolution: 3dppx) {

  .border-top-1px::before,
  .border-right-1px::before,
  .border-bottom-1px::after,
  .border-left-1px::after,
  .border-all::before {
    transform: scale(.3333) translateZ(0);
  }

  .border-top-1px::before,
  .border-bottom-1px::after,
  .border-all::before {
    width: 300%;
  }

  .border-right-1px::before,
  .border-left-1px::after,
  .border-all::before {
    height: 300%;
  }
}


/* 此外还可以设置通用字体颜色，链接颜色等，根据需求增减 */


/*
2023-7-7 增加 vw + rem 适配方案
使用条件：
  1. 设计稿是 750px 的
  2. 设计稿是 2x 的
  3. 忽略不支持 vw 的老设备，android4.4 iOS8 以上都支持
原理：按照实际尺寸 375px 宽计算。那么 1vw == 3.75px，便于计算尺寸让 1rem ==100px，推断出 1rem = 26.6667vw。以后根据设计稿尺寸，直接缩小 100 倍，单位改为 rem，比如 5px 直接改为 0.05rem。
*/
html {
  /* font-size: 26.6667vw; 其他尺寸根据上面公式自行调整 */
  font-size: 13.33333vw; /* 其他尺寸根据上面公式自行调整 */
}
